<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>form表单二常用控件</title>
</head>
<body>
    <!--
        label标签：可以于表单控件相关联，关联后点击文字，与之相对应的表单控件就会获取焦点。一般不用它来给按钮标签去做关联。
    -->
    <form action="https://www.baidu.com/s" >
        <!--label实现关联的第一种方式-->
        <label for="tx">账号：</label><input id ="tx" type="text" name = "wd" maxlength="10" value="123"></br>
        <!--label实现关联的第二种方式-->
        <label>密码：<input type="password" name ="pwd" maxlength="20"></label>
        </br>
        性别：
        <label><input type = "radio" name = "gender" value="male">男</label>
        <label> <input type = "radio" name = "gender" value="female" checked>女</label>
        <br>
        爱好：
        <label><input type = checkbox name="hobby" value="smoke" checked>抽烟</label>
        <label> <input type = checkbox name="hobby" value="drink">喝酒</label>
        <label><input type = checkbox name="hobby" value="music">唱歌</label><br>
        <label>其他：<textarea name = "hobby" rows="2" cols="25"></textarea></label><br>
        <label>
            籍贯：
            <select name = "place">
                <option value="豫">河南</option>
                <option value="冀" selected>河北</option>
                <option value="赣">江西</option>
                <option value="鄂">湖北</option>
            </select>
        </label>
        <input type="hidden" name = "from" value = "baidu"><br>
        <button>提交</button>
        <button type = "reset">重置</button>
        <button type = "button">校验用户合法性</button>

    </form>
</body>
</html>